<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    
    <script>
        const canvas = document.createElement("canvas");
        //直接通过 width height属性设置宽高
        canvas.width=600;
        canvas.height=600;
        // 不要使用 css样式来设置 canvas的宽高,整体效果会出问题。
        // canvas.style.width="600px";
        // canvas.style.height="600px";
        document.body.appendChild(canvas);
        const ctx = canvas.getContext("2d");
        ctx.fillRect(100,100,50,50);
    </script>
</body>
</html>